<template>
  <div>
    <div class="tt">
      <div class="timer">今天的时间是：{{ FormatTime(nowTime) }}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'topTime',
  data() {
    return {
      timer: undefined,
      nowTime: new Date(),
      latedata: "2022-10-1",
    }
  },

  created() {
    // 显示时间，在渲染页面之前一直调用该函数，对this.time进行赋值
    this.timer = setInterval(() => {
      this.nowTime = new Date().toLocaleString();
    });
  },
  // 销毁定时器
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer);
    }
  },

  methods: {
    FormatTime() {
      //返回显示的日期时间格式
      var date = new Date();
      var year = this.formatTime(date.getFullYear());
      var month = this.formatTime(date.getMonth() + 1);
      var day = this.formatTime(date.getDate());
      //   var hour = this.formatTime(date.getHours());
      //   var minute = this.formatTime(date.getMinutes());
      //   var second = this.formatTime(date.getSeconds());
      var weekday = date.getDay();
      var weeks = new Array(
        "星期日",
        "星期一",
        "星期二",
        "星期三",
        "星期四",
        "星期五",
        "星期六"
      );
      var week = weeks[weekday];
      return `${year}-${month}-${day} ${week}`;
      //   return `${year}-${month}-${day} ${hour}:${minute}:${second} ${week}`;
    },
    formatTime(n) {
      //判断是否需要加0
      if (n < 10) {
        return "0" + n;
      } else {
        return n;
      }
    },
  }
}
</script>

<style scoped>
.tt {
  /* background: rgb( 10,163,133); */
  background: #1abc9c;
  display: flex;
  width: 100%;
  height: 50px;
  line-height: 50px;
  border-bottom: 2px solid rgb(28, 145, 88);
}

.timer {
  color: black;
  font-style: italic;
  font-weight: bold;
  width: 90%;
  margin: 0 auto;
}

/* .login{
        position: absolute;
        right: 30px;
        text-decoration: none;
    } */
</style>